<template>
    <div class="update">
        <el-progress class="progress" v-if="percentage" :percentage="percentage"
                     :show-text="false"></el-progress>
    </div>
</template>

<script type="text/ecmascript-6">
  import { ipcRenderer } from "electron";

  /**
   * @author 白雨浓
   * @date 2019/7/11 19:21
   *
   * 升级 组件
   **/
  export default {
    name: 'Update',
    data() {
      return {
        percentage: 0
      }
    },
    mounted() {
      this.$nextTick(() => {

        setTimeout(() => {
          /*检测升级*/
          ipcRenderer.send("check-update");
        }, 1000);
      });

      /*检测到新版本*/
      ipcRenderer.on("update-available", async (event, message) => {
        if (confirm("检测到新版本，是否升级？")) {
          ipcRenderer.send('download-update');
        }
      });

      /*下载进度*/
      ipcRenderer.on("download-progress", (event, progress) => {
        this.percentage = parseInt(progress.percent) || 0;
      });

      /*下载完成*/
      ipcRenderer.on("update-downloaded", async () => {
        this.percentage = 0;

        setTimeout(() => {
          if (confirm("下载完成，是否立即安装？(安装需要重启应用)？")) {
            ipcRenderer.send("quit-and-install");
          }
        }, 500);
      });

      ipcRenderer.on('error', (event, error) => {
        console.log(error);
      });
    },
    methods: {}
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
    .update {
        position fixed
        top 0
        left 0
        width 100%
        margin 10px auto
        z-index 1000

        .progress {
            width 80%
            margin auto
        }
    }
</style>
